<template>
    <div>
        <textarea v-if="defaultLabel=='textarea'&&lableName==''" v-model="lableValue[lableData]"></textarea>
        <textarea v-else-if="defaultLabel=='textarea'&&lableName!=' '" v-model="lableValue[lableData][lableName]"></textarea>
        <span class="lable-span" v-if="defaultLabel=='span'&&lableName==''&&arrIndex==-1" v-text="lableValue[lableData]"></span>
        <span class="lable-span" v-else-if="defaultLabel=='span'&&lableName!=''&&arrIndex==-1" v-text="lableValue[lableData][lableName]"></span>
        <span class="lable-span" v-else-if="defaultLabel=='span'&&arrIndex!=-1" v-text="lableValue[lableData][arrIndex][lableName]"></span>
        <input v-if="defaultLabel=='input'&&arrIndex!=-1" v-model="lableValue[lableData][arrIndex][lableName]"/>
        <input v-else-if="defaultLabel=='input'&&arrIndex==-1" v-model="lableValue[lableData]"/>
        <el-date-picker  v-if="defaultLabel=='dateTime'"
            v-model="lableValue[lableData]"
            type="datetime"
            placeholder="选择日期时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            >
        </el-date-picker>
        <div class="selectText" v-if="defaultLabel=='selectText'&&lableName==''&&arrIndex==-1" @click="lableTextClick(lableData)">
          <span class="selectText-span" v-if="lableValue[lableData]">
            {{lableValue[lableData]}}
<!--            <span class="selectText-span-close" @click.stop="deleteLable(lableData)">x</span>-->
          </span>
        </div>
        <div class="selectText" v-if="defaultLabel=='selectText'&&arrIndex!=-1" @click="lableTextClick({type:lableData,value:lableValue[lableData][arrIndex]})">
            <span class="selectText-span" v-if="lableValue[lableData][arrIndex][lableName]">
              {{lableValue[lableData][arrIndex][lableName]}}
<!--              <span class="selectText-span-close" @click.stop="deleteLable(lableValue[lableData][arrIndex])">x</span>-->
            </span>
        </div>
<!--      <input v-if="defaultLabel=='input'&&arrIndex!=-1" v-model="lableValue[lableData][arrIndex][lableName]"/>-->
    </div>
</template>
<script>
    export default {
        props:{
            lableData:{//字段
                type:String,
                default:""
            },
            lableValue:{//值
                type:Object,
                default:{}
            },
            workType:{//工作流的节点
                type:String
            },
            arrIndex:{
                type:Number,
                default:-1
            },
            lableName:{
                type:String,
                default:''
            }
        },
        watch:{
            workType:{
                handler(newValue, oldValue) {
                    this.defaultLabel="span";
                    this.init();
                },
                deep: true
　　　　　　  }
        },
        data(){
            return{
                defaultData:{
                    orgName:[
                        {key1111:"selectText"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//动火单位名称
                    orgFzr:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//动火单位负责人
                    deptName:[
                        {key1111:"selectText"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//部门名称
                    recordCode:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//记录编号
                    recordVersion:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//记录版本号
                    saveYear:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//保存年限
                    seqNum:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//编号
                    projectName:[
                        {key1111:"selectText"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//动火部位及具体项目
                    fkCode:[
                        {key1111:"span"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//风控编号
                    // dhType:[
                    //     {key1111:"input"}
                    // ],//动火方式
                    dhPerson:[
                        {key1111:"selectText"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//动火人
                    khPerson:[
                        {key1111:"selectText"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//看火人
                    degReason:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//危险因素
                    degDemo:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],//危险描述
                    qz1:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"textarea"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],
                    qz2:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"textarea"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],
                    qz3:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"textarea"},
                        {Activity_09l6cp0:"span"}
                    ],
                    qz4:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"textarea"},
                    ],
                    qz5:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                        {Activity_1bc1nyr:"textarea"}
                    ],
                    realEndTime:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                    ],
                    dhHours:[
                        {key1111:"input"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                        {Activity_1bc1nyr:"input"}
                    ],
                    planEndTime:[
                        {key1111:"dateTime"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"span"},
                        {Activity_1bc1nyr:"dateTime"}
                    ],
                    content:[
                        {key1111:"textarea"},
                        {Activity_0rk8buu:"span"},
                        {Activity_1pbddgw:"span"},
                        {Activity_0ol7j8o:"span"},
                        {Activity_0rl1zv4:"span"},
                        {Activity_09l6cp0:"textarea"},

                    ]
                    //字段
                    // orgName:[
                    //     //key 工作流的节点
                    //     {"key":"textarea"},
                    //     {"key1":"input"},
                    //     {"key2":"span"}
                    // ],
                    // orgFzr:[
                    //     {"key":"input"}
                    // ],
                    // projectName:[
                    //     {"key":"textarea"}
                    // ],
                    // fkCode:[
                    //     {"key":"input"}
                    // ],
                    // dhType:[
                    //     {"key":"input"}
                    // ],
                    // dhPerson:[
                    //     {"key":"input"}
                    // ],
                    // khPerson:[
                    //     {"key":"input"}
                    // ],
                    // degReason:[
                    //     {"key":"textarea"}
                    // ],
                    // degDemo:[
                    //     {"key":"textarea"}
                    // ],

                },
                defaultLabel:"span"
            }
        },
        mounted(){
            this.init()
        },
        methods: {
            init() {
                for(var i=0;i<this.defaultData[this.lableData].length;i++){
                    let lableArr=this.defaultData[this.lableData][i];
                    for(var key in lableArr){
                        if(key==this.workType){
                            this.defaultLabel=lableArr[key];
                            break;
                        }
                    }
                }
            },
            lableTextClick(lableKey,key){
              debugger;
              if(key){
                let newLableKey={type:key,value:lableKey};
                this.$emit('lableClick',newLableKey);
              }else{
                this.$emit('lableClick',lableKey);
              }

            },
            deleteLable(lableKey){
              this.$emit('deleteLable',lableKey)
            }
        }
    }
</script>
<style lang="scss" scoped>
@import "../assets/styles/mixin";/*引入配置*/
textarea{
    resize: none;
    border:0px;
    border-bottom:1px solid #ccc;
    width:80%;
    height:28px;
}
input{
    min-width: 80%;
    border:0px;
    border-bottom:1px solid #ccc;
    height:26px;
}
.lable-span{
    display: inline-block;
    width:80%;
}
.selectText{
  border:0px;
  border-bottom:1px solid #ccc;
  width:80%;
  height:28px;
}
.selectText-span{
  display:inline-block;
  padding:2px 10px;
  padding-right:20px;
  //border:1px solid #ccc;
  //@include bg_color($background-color-theme-light1);
  position:relative;
}
.selectText-span-close{
  position:absolute;
  top:-2px;
  right:5px;
  cursor: pointer;
}
</style>
